<mat-card class="page-title">
    <span>健康测量</span>
    <div class="btn-toolbar float-right" role="toolbar">
        <a (click)="refresh()" matTooltip="刷新" (disabled)="updatingHealth">
            <mat-icon color="primary">refresh</mat-icon>
        </a>
    </div>
</mat-card>

<mat-card>
    <div class="table-responsive">
        <table id="healthCheck" class="table table-striped">
            <thead>
                <tr>
                    <th>服务</th>
                    <th class="text-center">状态</th>
                    <th class="text-center">详情</th>
                </tr>
            </thead>
            <tbody>
                <tr *ngFor="let health of healthData">
                    <td><span class="text-capitalize">{{ baseName(health.name) }}</span> {{subSystemName(health.name)}}</td>
                    <td class="text-center">
                        <span class="badge" [ngClass]="getBadgeClass(health.status)">
                            {{health.status}}
                        </span>
                    </td>
                    <td class="text-center">
                        <a class="hand" (click)="showHealth(health)" *ngIf="health.details || health.error">
                            <i class="fa fa-eye"></i>
                        </a>
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
</mat-card>
